import 'package:flutter/material.dart';

class MyChip extends StatelessWidget{
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return MyChips();
  }
}

class MyChips extends StatefulWidget{
  @override
  MyChipsState createState() {
    // TODO: implement createState
    return MyChipsState();
  }
}
class MyChipsState extends State<MyChips>{
  bool _selectValue=false;
  List<String> _tags=[
    'Apple',
    'Banana',
    'Pear',
    'Watermelon',
    'Mongo'
  ];
  String _action='';
  List<String> _selected=[];
  String _choice='';
  List<String> _choices=[];

  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return Scaffold(
        appBar: AppBar(
          title: Text("Chip"),
        ),
        body: Container(
            alignment: Alignment.center,
            padding: EdgeInsets.only(left: 20,right: 20),
            child:Wrap(
              spacing: 9.0,
              children: <Widget>[
                Chip(
                  label: Text("James"),

                ),
                Chip(
                  label: Text("Kobe"),
                  backgroundColor: Colors.orange,
                ),
                Chip(
                  label: Text("Haward"),
                  avatar: CircleAvatar(
                    child: Text("C"),
                    backgroundColor: Colors.lightBlue,
                  ),
                ),
                Chip(
                  label: Text("Ivring"),
                  avatar: CircleAvatar(
                    backgroundImage: NetworkImage('https://ss2.baidu.com/6ONYsjip0QIZ8tyhnq/it/u=3389922971,3273579406&fm=58&bpow=408&bpoh=612'),
                  ),
                ),
                Chip(
                  label: Text("Kobe"),
                  deleteIcon: Icon(Icons.delete),
                  deleteIconColor: Colors.redAccent,
                  onDeleted: (){

                  },
                  deleteButtonTooltipMessage: '点击删除',
                ),
                Divider(
                  height: 10.0,
                  indent: 5.0,
                  color: Colors.orange,
                ),
                Wrap(
                    spacing: 8.0,
                    children: _tags.map((tag){
                      return Chip(
                        label: Text(tag),
                        onDeleted: (){
                          setState(() {
                            _tags.remove(tag);
                          });
                        },
                      );
                    }).toList()
                ),
                Divider(
                  color: Colors.lightBlue,
                ),
                Container(
                  child: Text("单选chip：$_action"),
                  width: double.infinity,
                ),
                Wrap(
                    spacing: 8.0,
                    children: _tags.map((tag){
                      return ActionChip(
                        label: Text(tag),
                        onPressed: (){
                          setState(() {
                            _action=tag;
                          });
                        },
                      );
                    }).toList()
                ),
                Divider(
                  color: Colors.lightBlue,
                ),
                Container(
                  child: Text("多选chip：${_selected.toString()}"),
                  width: double.infinity,
                ),
                Wrap(
                    spacing: 8.0,
                    children: _tags.map((tag){
                      return FilterChip(
                        label: Text(tag),
                        selected: _selected.contains(tag),
                        onSelected: (value){
                          setState(() {
                            if(_selected.contains(tag)){
                              _selected.remove(tag);
                            }else{
                              _selected.add(tag);
                            }
                          });
                        },
                      );
                    }).toList()
                ),
                Divider(
                  color: Colors.lightBlue,
                ),
                Container(
                  child: Text("具有选中状态的单选chip：$_choice"),
                  width: double.infinity,
                ),
                Wrap(
                    spacing: 8.0,
                    children: _tags.map((tag){
                      return ChoiceChip(
                        label: Text(tag),
                        selected: _choice==tag,
                        onSelected: (value){
                          setState(() {
                            _choice = tag;
                          });
                        },
                      );
                    }).toList()
                ),
                Divider(
                  color: Colors.lightBlue,
                ),
                Container(
                  child: Text("具有选中状态的多选chip：${_choices.toString()}"),
                  width: double.infinity,
                ),
                Wrap(
                    spacing: 8.0,
                    children: _tags.map((tag){
                      return ChoiceChip(
                        label: Text(tag),
                        selected: _choices.contains(tag),
                        onSelected: (value){
                          setState(() {
                            if(_choices.contains(tag)){
                              _choices.remove(tag);
                            }else{
                              _choices.add(tag);
                            }
                          });
                        },
                      );
                    }).toList()
                )
              ],
            )
        ),
      floatingActionButton: FloatingActionButton(
          child: Icon(Icons.restore),
          onPressed: (){
            setState(() {
              _tags=[
                'Apple',
                'Banana',
                'Pear',
                'Watermelon',
                'Mongo'
              ];
              _action='';
              _selected=[];
              _choices=[];
            });
          },
          ),
    );
  }
}




